<template>
  <div class="q-pa-md">
    <t-quick-filter ref="refQuickFilter" :filterFields='filterFields' :quickItems="quickItems"
      :quickItemSummary="quickItemSummary" @init="onInitHandler" @querySummary="onQuerySummaryHandler"></t-quick-filter>
  </div>
</template>

<script>
import { useQuasar } from '@teld/q-components';
import { result, transform } from 'lodash';
import { computed, ref } from 'vue';
import label from '../label';

export default {
  setup() {
    const $q = useQuasar();

    const refQuickFilter = ref(null);
    const quickItems = ref({});
    const quickItemSummary = ref({})

    const onInitHandler = () => {

      /**
       * 这里进行SDO数据的情况
       * 1.根据 refQuickFilter.value?.filterItemsIsSDO 数组批量请求SDO数据
       *  filterItemsIsSDO 的接口参考 filterFields里的值
       * 2.并将结果赋值给变量 quickItems 属性绑定的变量
       * 3. quickItems 的 结构
       * {
         "AAA": [ { "label": "隐藏", "value": "隐藏" }, { "label": "中文", "value": "CN" }, ...]
         "BBB": [ { "label": "隐藏", "value": "隐藏" }, { "label": "中文", "value": "CN" } ]
         ...
       * }
       */

       /** 示例代码 */
      quickItems.value = _.transform(
        refQuickFilter.value?.filterItemsIsSDO,
        (result, f) => {
          result[f.fieldAlias] = [
            { label: '状态-0', value: '0' },
            { label: '状态-1', value: '1' },
            { label: '英文-2', value: '2' },
          ];
        },
        {},
      );
    };

    const onQuerySummaryHandler = filterExpression => {

      /** 统计数据
       * 调用绑定的数据源 进行 使用 入参 filterExpression 进行 DQ 查询
       * https://alidocs.dingtalk.com/i/nodes/14dA3GK8gkwY35ADTjvYgP3j89ekBD76?doc_type=wiki_doc&iframeQuery=utm_source%3Dportal%26utm_medium%3Dportal_recent&rnd=0.12017852477600766# 「快捷筛选组件设计」
       *
       * 返回的结构 赋值给 quickItemSummary 属性绑定的变量
      */

      console.log('onQuerySummaryHandler', filterExpression);
      let mockSummary = refQuickFilter.value.mockSummary;
      quickItemSummary.value = refQuickFilter.value.wrapSummary([
        { Total: mockSummary(), State: '0', State2: '0' },
        { Total: mockSummary(), State: '1', State2: '2' },
        { Total: mockSummary(), State: '2', State2: 'CN' },
        { Total: mockSummary(), State: 'CN', State2: 'CN' },
        { Total: mockSummary(), State: 'EN', State2: 'EN' },
        { Total: mockSummary(), State: 'EN', State2: 'EN' },
      ]);
    };

    const filterFields = ref([
      {
        "ID": "7a7842d3-1169-4c23-b7ac-b3856c6906c4",
        "tableAlias": "DO_do_projectbug_cj121801",
        "tableCode": "DO_do_projectbug_cj121801",
        "tableName": "do_projectbug_cj121801",
        "fieldCode": "State",
        "fieldName": "状态",
        "fieldAlias": "State",
        "displayType": "tab",
        "mockDataModel": "default",
        "isMultiple": true,
        "enableStatistics": true,
        "enableAllItem": true,
        "hideEmpty": true,
        "showTitle": false,
        "dataType": "Int",
        "valueType": "sdo",
        "filter_dataValue": "{\"DataBind\":\"DataQuery.GetSDO_statemachinetest_selectBasicList(DefaultInputFilter,PageIndex,PageSize,AdvancedFilter,AdvancedSort).List\",\"DataSource\":\"5030e87f-3250-4c3f-a839-bbf18630b57e\",\"ActionType\":3,\"RelatedCdoCode\":\"GetSDO_statemachinetest_selectBasicList\",\"ServicePara\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}],\"isMultiple\":false,\"labelField\":\"Name\",\"valueField\":\"Code\",\"columns\":[{\"ID\":\"Code\",\"dataField\":\"Code\",\"caption\":\"编号\",\"dataType\":\"Int\"},{\"ID\":\"Name\",\"dataField\":\"Name\",\"caption\":\"名称\",\"dataType\":\"String\"}],\"ServiceParam\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}]}"
      },
      {
        "ID": "7a7842d3-1169-4c23-b7ac-bool",
        "tableAlias": "DO_do_projectbug_cj121801",
        "tableCode": "DO_do_projectbug_cj121801",
        "tableName": "do_projectbug_cj121801",
        "fieldCode": "bool",
        "fieldName": "逻辑值",
        "fieldAlias": "bool",
        "displayType": "tab",
        "mockDataModel": "default",
        "isMultiple": false,
        "enableStatistics": false,
        "hideEmpty": false,
        "showTitle": false,
        "dataType": "Int",
        "valueType": "boolean",
        "filter_dataValue": ""
      },
      {
        "ID": "7a7842d3-1169-4c23-b7ac-bool",
        "tableAlias": "DO_do_projectbug_cj121801",
        "tableCode": "DO_do_projectbug_cj121801",
        "tableName": "do_projectbug_cj121801",
        "fieldCode": "date",
        "fieldName": "日期",
        "fieldAlias": "date",
        "displayType": "tab",
        "mockDataModel": "default",
        "isMultiple": false,
        "enableStatistics": false,
        "hideEmpty": false,
        "showTitle": false,
        "dataType": "Int",
        "valueType": "date",
        "filter_dataValue": ""
      },
      {
        "ID": "7a7842d3-1169-4c23-b7ac-b3856c6906c4",
        "tableAlias": "DO_do_projectbug_cj121801",
        "tableCode": "DO_do_projectbug_cj121801",
        "tableName": "do_projectbug_cj121801",
        "fieldCode": "State2",
        "fieldName": "状态2",
        "fieldAlias": "State2",
        "displayType": "tab",
        "mockDataModel": "default",
        "isMultiple": false,
        "enableStatistics": false,
        "hideEmpty": false,
        "showTitle": false,
        "dataType": "Int",
        "valueType": "sdo",
        "filter_dataValue": "{\"DataBind\":\"DataQuery.GetSDO_statemachinetest_selectBasicList(DefaultInputFilter,PageIndex,PageSize,AdvancedFilter,AdvancedSort).List\",\"DataSource\":\"5030e87f-3250-4c3f-a839-bbf18630b57e\",\"ActionType\":3,\"RelatedCdoCode\":\"GetSDO_statemachinetest_selectBasicList\",\"ServicePara\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}],\"isMultiple\":false,\"labelField\":\"Name\",\"valueField\":\"Code\",\"columns\":[{\"ID\":\"Code\",\"dataField\":\"Code\",\"caption\":\"编号\",\"dataType\":\"Int\"},{\"ID\":\"Name\",\"dataField\":\"Name\",\"caption\":\"名称\",\"dataType\":\"String\"}],\"ServiceParam\":[{\"ID\":\"d149d54e-dce5-42ba-a845-e1b0526b63b1\",\"Code\":\"DefaultInputFilter\",\"Name\":\"模糊匹配参数\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"7462d708-6ee5-43cd-82ce-47cd37fb8bd8\",\"Code\":\"PageIndex\",\"Name\":\"页码\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"262e9b92-6a97-49f8-ae77-ae5c7d91737b\",\"Code\":\"PageSize\",\"Name\":\"分页大小\",\"DataType\":2,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"35fd7cf3-5fd7-4ac3-9e75-558222989dc1\",\"Code\":\"AdvancedFilter\",\"Name\":\"高级查询过滤条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"},{\"ID\":\"f47251eb-5371-4872-8350-f71a032e7d83\",\"Code\":\"AdvancedSort\",\"Name\":\"高级查询排序条件\",\"DataType\":9,\"IsEmpty\":0,\"Value\":\"\"}]}"
      }
    ])

    const msg = ref();

    return {
      msg,
      refQuickFilter,
      filterFields,
      quickItems,
      quickItemSummary,
      onInitHandler,
      onQuerySummaryHandler,
    };
  },
};
</script>
